@import './../../styles/mixin.scss';

.nav-header {
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	height: 88px;
	line-height: 88px;

	&-content {
		display: flex;
		align-items: center;

		&-left {
			&-icon-group {
				width: 160px;
				display: flex;
				align-items: center;
				border-radius: 16px;
				border: 1px solid #fff;
				background-color: rgba($color: #333, $alpha: 0.4);
			}

			&-icon {
				width: 40px;
				height: 100%;
				padding: 0 20px;
				display: flex;
				align-items: center;

				&-divider {
					height: 36px;
					width: 2px;
					background-color: #fff;
				}
			}
		}

		&-center {
			flex: 1;
			text-align: center;
			@include textOrient(1);
			font-size: 32px;
		}

		&-right {
			width: 20%;
			height: 100%;
		}
	}
}
